<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<style>
		body{
			margin: 0;
			overflow: hidden;
		}
	</style>
	<body>
	</body>
	<script src="../three/three.min.js">
		/**
		 * 创建场景
		 */
		let scene = new THREE.Scene()
		/**
		 * 创建模型
		 */
		let box = new THREE.BoxGeometry(20,50,100)
		// 设置材质
		let mat = new THREE.MeshLambertMaterial({
			color: 0xffff33
		})
		/**
		 * 创建网格模型
		 */
		let mesh = THREE.Mesh(box, mat)
		// 将网格模型添加道场景中
		scene.add(mesh)
		
		/**
		 * 光源设置
		 */
		//点光源
		let point = new THREE.PointLight(0x99ffff)
		//点光源位置设置
		point.position.set(100,100,100)
		scene.add(point)
		
		//环境光
		let ambient = new THREE.AmbientLight(0xffffcc)
		scene.add(ambient)
		
		/**
		 * 相机设置
		 */
		let width = 1500
		let height = 1500
		
		let k = width / height
		let s = 200
		
		// 创建相机
		let camera = new THREE.OrthographicCamera(-s * k, s * k, s, -s, 1, 1000)
		camera.position(100,100,100)
		camera.lookAt(scene.position)
		
		/**
		 * 创建渲染器对象
		 */
		let renderer = new THREE.WebGLRenderer()
		renderer.setSize(width,height)
		renderer.setClearColor(0x000033, 1)
		
		document.body.appendChild(renderer.domElement)
		renderer.render(scene,camera)
	</script>
</html>
